<template>
    <div class="teach">
      <titlebar><template #bar>讲师详情</template></titlebar>
      <bar :detailList="detailList" @guanzhu="gz"></bar>
      <cut :tabList="tabList" @tabFn="abFn">
        <div v-if="i==0">讲师介绍111</div>
        <div v-if="i==1">主讲课程222</div>
        <div v-if="i==2">学员评价333</div>
      </cut>
    </div>
</template>

<script>
import { getTearchDetail } from "@/http/teach"
import titlebar from "@/components/teacher/titlebar.vue"
import bar from "@/components/teacher/bar.vue"
import cut from "@/components/teacher/cut.vue"
export default {
    
    data(){
        return {
            detailList: {},
            tabList: [
                { "id": 1, "title": "讲师介绍" },
                { "id": 2, "title": "主讲课程" },
                { "id": 3, "title": "学员评价" },
            ],
            i: 0
        }
    },
    mounted(){
        this.getTearchDetailList()
    },
    methods:{
       async getTearchDetailList(){
            let res = await getTearchDetail(this.$route.query.id)
            console.log(res);
            this.detailList=res.data
        },
        gz(){
            this.getTearchDetailList()
        },
        abFn(i){
            this.i=i
        }
    },
  components:{
        titlebar,bar,cut
  }
}
</script>

<style>

</style>
